<template>
    <div>
        <button @click="goHome1">去主页1</button>
        <button @click="goHome2">去主页2</button>
        <button @click="goHome3">去主页3</button>
    </div>
</template>

<script lang='ts'>
import {defineComponent, ref, reactive, toRefs, computed} from 'vue'
import {useRouter} from "vue-router"
export default defineComponent({
  setup(){
    let router = useRouter();
    let goHome1 = () => {
      router.push({
        name : "index",
        params : {id : 1}
      })
    }
    let goHome2 = () => {
      router.push({
        path : "/index",
        query : {id : 2}
      })
    }
    let goHome3 = () => {
      router.push({
        path : '/index/3'
      })
    }
    return{
      goHome1,
      goHome2,
      goHome3,
    
    }
  },
});
</script>

<style scoped >

</style>
